<script setup>
import { ref, onMounted, onBeforeMount } from 'vue'
import { getContentListApi } from '../../apis/apis'
import Aside from '../components/Aside.vue';
import ContentList from '../components/ContentList.vue';

// 记录条数
const total = ref(10)
// 主页展示的列表
const homeContentList = ref([])
// 当前页
const current = ref(1)
// 骨架屏
const loading = ref(true)
// 查询后端, 返回一页的主页contentList
const pageChange = (num) => {
  getInfo(num)
}
// 获取文章详细信息
const getInfo = async (num) => {
  const res = await getContentListApi(num, '')
  total.value = res.data?.total
  homeContentList.value = res.data?.pageList
}

onMounted(async () => {
  await getInfo(current.value)
  setTimeout(() => {
    loading.value = false
  }, 200);
})

</script>

<template>
  <div>
    <ContentList @pageChange="pageChange" :total="total" :loading="loading" :contentList="homeContentList" ></ContentList>
  </div>
  
</template>

<style
  scoped
  lang='scss'
></style>